<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<title>骨医快线</title>
	<link href="../../css/mui.plus.css" rel="stylesheet" />		
	<style>
		.oe-club form {
			margin: 40px auto;
			width: 80%;
			text-align: center;
		}
		.oe-club input {
			border-radius: 8px;
			text-align: center;
			background-color: #f5f5f5;
		}
		.mui-input-group:after,
		.mui-table-view-cell:after,
		.mui-table-view-cell:after, .mui-input-group .mui-input-row:after {
			content: none;
		}
		.oe-webkit-box {
			display: -webkit-box;
		}		
		.oe-webkit-box>input {
			display: block;
			-webkit-box-flex: 1;
		}
		.oe-webkit-box>button {
			margin: 0 -8px 0 8px;
			height: 40px;
		}
		.pat-btn-enter {
			margin: 60px 0 0 	;
			width: 100%;
			height: 40px;
		}
	</style>
</head>
<body>
	<header class="mui-bar mui-bar-nav oe-pri-bar">
	    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
	    <h1 class="mui-title">骨研社</h1>
	</header>
	
	<div class="mui-content oe-club">
		<form class="mui-input-group">
			<div class="mui-input-row">
				<input id="ipt-tel" type="number" class="mui-input-clear" placeholder="请输入手机号" maxlength="11">
			</div>
			<div class="oe-webkit-box" style="margin-top: 15px;">
				<input id="ipt-pin" type="tel" placeholder="输入验证码" maxlength="6" style="padding-right: 20px;">
				<button id="btn-pin" type="button" class="mui-btn mui-btn-primary" onclick="return false;">获取验证码</button>&nbsp;&nbsp;
			</div>
			
			<button id="btn-verify" type="button" class="mui-btn mui-btn-primary pat-btn-enter">进入骨研社</button>
		</form>
		
	    <div class="oe-emp">
			<img src="../../images/blank_page/club.png"/>
		</div>
	</div>
	
	<script src="../../js/mui.min.js"></script>
	<script src="../../js/app.js"></script>
	<script src="../../js/lib/template.js"></script>
	<script type="text/javascript">
		(function($, a){
			var iptTel = document.getElementById("ipt-tel"),
				iptPin = document.getElementById("ipt-pin");

			$.plusReady(function(){
				if(app.storage.getGysUserId()){
					$.openWindow({
						url: 'list.html',
						waiting: {
							autoShow: false
						},
						extras: {
							data : app.storage.getGysUserInfo()
						}
					});
				}
			})
			
			$('.mui-content').on('tap', '#btn-pin', function(){
				var tel = iptTel.value;
				
				//	验证手机号格式
				if(!(/^1[3|4|5|7|8]\d{9}$/.test(tel))) return $.toast('手机号格式有误');
				
				app.net.ajax('c_auth_code/get_sms_auth_code2', {ac_mobile: tel}, 'get', function(data){
					if(data && data.code === '100'){
						$.toast('验证码已发送，请注意查收');
					}else if(data && data.code === '401'){
						$.toast('该手机号在骨研社尚未登记');
					}else if(data && data.code === '402'){
						$.toast('请在1分钟后再次请求验证码');
					}else if(data && data.code === '403'){
						$.toast('验证码发送量已达手机号单日最大限额');
					}
				});
			})

			$('.mui-content').on('tap', '#btn-verify', function(){
				var tel = iptTel.value,
					pin = iptPin.value;
					
//				 由于验证码条数限制，这里测试时暂时放开
//				$.openWindow({
//					url: 'list.html',
//					waiting: {
//						autoShow: false
//					},
//					extras: {
//						data : {
//							actor_id: 2,
//							actor_hospital: '陆军总医院'
//						}
//					}
//				});
					
//					验证手机号格式
//				if(!(/^1[3|4|5|7|8]\d{9}$/.test(tel))) return $.toast('手机号格式有误');
				
				app.net.get('c_auth_code/check_sms_auth_code2', {ac_mobile: tel, ac_code: pin}, function(data){
					if(data && data.code === '100'){
						app.storage.setGysUserInfo(data.data);
						$.toast('校验通过');
						$.openWindow({
							url: 'list.html',
							waiting: {
								autoShow: false
							},
							extras: {
								data : data.data
							}
						});
					}else if(data && data.code === '400'){
						$.toast('验证码错误，请重新输入');
					}
				});
				
			});
			
		}(mui, app));
	</script>
</body>
</html>